export default function(elem, is, time) {
  let timer = null
  var $a = $(elem + ' .buttons a')
  var $s = $(elem + ' .buttons span')
  var $l = $(elem + ' .carousel li')
  var $i = $(elem + ' .infolist div')
  var cArr = ['p-7', 'p-6', 'p-5', 'p-4', 'p-3', 'p-2', 'p-1']
  var dArr = ['d-7', 'd-6', 'd-5', 'd-4', 'd-3', 'd-2', 'd-1']
  var index = 0
  $(elem + ' .infolist div.d-3').show()
  // $(elem + " .next").click(
  // 	function(){
  // 		nextimg();
  // 	}
  // )
  // $(elem + " .prev").click(
  // 	function(){
  // 		previmg();
  // 	}
  // )
  //上一张
  function previmg() {
    cArr.unshift(cArr[6])
    dArr.unshift(dArr[6])
    cArr.pop()
    dArr.pop()
    //i是元素的索引，从0开始
    //e为当前处理的元素
    //each循环，当前处理的元素移除所有的class，然后添加数组索引i的class
    $l.each(function(i, e) {
      $(e)
        .removeClass()
        .addClass(cArr[i])
    })
    $i.each(function(i, e) {
      $(e)
        .removeClass()
        .addClass(dArr[i])
    })
    index--
    if (index < 0) {
      index = 6
    }
    show()
  }

  //下一张
  function nextimg() {
    cArr.push(cArr[0])
    dArr.push(dArr[0])
    cArr.shift()
    dArr.shift()
    $l.each(function(i, e) {
      $(e)
        .removeClass()
        .addClass(cArr[i])
    })
    $i.each(function(i, e) {
      $(e)
        .removeClass()
        .addClass(dArr[i])
    })
    index++
    if (index > 6) {
      index = 0
    }
    show()
  }

  //通过底下按钮点击切换
  $a.each(function() {
    $(this).click(function() {
      var myindex = $(this).index()
      var b = myindex - index
      if (b == 0) {
        return
      } else if (b > 0) {
        /*
         * splice(0,b)的意思是从索引0开始,取出数量为b的数组
         * 因为每次点击之后数组都被改变了,所以当前显示的这个照片的索引才是0
         * 所以取出从索引0到b的数组,就是从原本的这个照片到需要点击的照片的数组
         * 这时候原本的数组也将这部分数组进行移除了
         * 再把移除的数组添加的原本的数组的后面
         */
        var newarr = cArr.splice(0, b)
        var dnewarr = dArr.splice(0, b)
        cArr = $.merge(cArr, newarr)
        dArr = $.merge(dArr, dnewarr)
        $l.each(function(i, e) {
          $(e)
            .removeClass()
            .addClass(cArr[i])
        })
        $i.each(function(i, e) {
          $(e)
            .removeClass()
            .addClass(dArr[i])
        })
        index = myindex
        show()
      } else if (b < 0) {
        /*
         * 因为b<0,所以取数组的时候是倒序来取的,也就是说我们可以先把数组的顺序颠倒一下
         * 而b现在是负值,所以取出索引0到-b即为需要取出的数组
         * 也就是从原本的照片到需要点击的照片的数组
         * 然后将原本的数组跟取出的数组进行拼接
         * 再次倒序,使原本的倒序变为正序
         */
        cArr.reverse()
        dArr.reverse()
        var oldarr = cArr.splice(0, -b)
        var doldarr = dArr.splice(0, -b)
        cArr = $.merge(cArr, oldarr)
        dArr = $.merge(dArr, doldarr)
        cArr.reverse()
        dArr.reverse()
        $l.each(function(i, e) {
          $(e)
            .removeClass()
            .addClass(cArr[i])
        })
        $i.each(function(i, e) {
          $(e)
            .removeClass()
            .addClass(dArr[i])
        })
        index = myindex
        show()
      }
    })
  })

  //改变底下按钮的背景色
  function show() {
    $($s)
      .eq(index)
      .addClass('blue')
      .parent()
      .siblings()
      .children()
      .removeClass('blue')
    setTimeout(function() {
      $i.hide()
      $(elem + ' .infolist div.d-3').show()
    }, 500)
  }

  //点击class为p2的元素触发上一张照片的函数
  $(document).on('click', elem + ' .p-2', function() {
    previmg()
    return false //返回一个false值，让a标签不跳转
  })

  //点击class为p4的元素触发下一张照片的函数
  $(document).on('click', elem + ' .p-4', function() {
    nextimg()
    return false
  })
  if (is) {
    //鼠标移入box时清除定时器
    $(elem).mouseover(function() {
      clearInterval(timer)
    })

    //鼠标移出box时开始定时器
    $(elem).mouseleave(function() {
      timer = setInterval(nextimg, time)
    })

    //进入页面自动开始定时器
    timer = setInterval(nextimg, time)
  }
}
